<template>
  <div class="tab-panel" id="panel44">
    <div align="center" class="commonPanelBorder">

      <div style="display:none" id="editCepWindow64">

      </div>
      <div class="table" style="width:800px;margin-top:50px;">
        <div class="table_title_row">
          <div style="width:20%;position:relative;float:left;background-color:blue;text-align:left;">&nbsp;<span>Autorizada</span>
          </div>
          <div style="width:60%;position:relative;float:left;background-color:blue;"><span>Consulta de Orden de Pago Enviada</span>
          </div>
          <div style="width:20%;position:relative;float:left;background-color:blue;text-align:right;">
            (<span>{{ rows.transactionId }}</span>)&nbsp;
          </div>
        </div>
        <div class="table_row" style="padding-bottom:5px;border-bottom:black thin solid">
          <table width="100%">
            <colgroup>
              <col width="25%">
              <col width="25%">
              <col width="25%">
              <col width="25%">
            </colgroup>
            <tbody>
            <tr>
              <td class="value etiqueta">Fecha Operación:</td>
              <td><span style="margin-left:0" class="value">{{rows.endTime}}</span></td>
              <td class="value etiqueta">Tipo de Pago:</td>
              <td><span style="padding-left:0" class="value">Tercero a Tercero</span></td>
            </tr>
            <tr>
              <td class="value etiqueta"><span>Empresa Operante: </span></td>
              <td><span style="padding-left:0" class="value">MUITECH_SA</span></td>
              <td class="value etiqueta">Institución Contraparte:</td>
              <td><span style="padding-left:0" class="value">GEM-STP</span></td>
            </tr>
            <tr>
              <td class="value etiqueta">Clave de Rastreo:</td>
              <td><span style="margin-left:0" size="15" class="value">{{rows.platformOrderId}}</span></td>
              <td class="value etiqueta">Importe:</td>
              <td><span style="margin-left:0" class="value">${{rows.deductionAmount}}</span></td>
            </tr>


            <tr>
              <td class="value etiqueta">Prioridad:</td>
              <td><span style="padding-left:0;" class="value">Normal</span></td>
              <td class="value etiqueta">Topología:</td>
              <td><span style="padding-left:0;" class="value">V</span></td>
            </tr>
            </tbody>
          </table>
        </div>
        <div class="table_row" style="padding-bottom:5px;border-bottom:black thin solid">
          <table width="100%">
            <tbody>
            <tr>
              <td class="value etiqueta">Tiempo de Liquidación:</td>
              <td><span style="margin-left:0" class="value"></span></td>
              <td class="value etiqueta"><span>Folio de Paquete:</span></td>
              <td><span style="padding-left:0" class="value"></span></td>
              <td class="value etiqueta">Usuario:</td>
              <td><span style="padding-left:0" class="value">muitech</span></td>
            </tr>
            <tr>
              <td class="value etiqueta">Fecha Captura:</td>
              <td><span style="margin-left:0" class="value">{{rows.createTime}}</span></td>
              <td class="value etiqueta">Folio de pago:</td>
              <td><span style="padding-left:0" class="value"></span></td>
              <td class="value etiqueta">Usuario Autoriza:</td>
              <td><span style="padding-left:0" class="value">muitech</span></td>
            </tr>
            <tr>
              <td class="value etiqueta">Tiempo Envío:</td>
              <td><span style="..." class="value"></span></td>
              <td class="value etiqueta">Tiempo Entrega:</td>
              <td><span style="margin-left:0" class="value"></span></td>
              <td class="value etiqueta">Tiempo Devolución:</td>
              <td><span style="..." class="value"></span></td>
            </tr>
            </tbody>
          </table>
        </div>
        <div class="table_row" style="padding-bottom:5px;border-bottom:black thin solid">
          <table width="100%">
            <tbody>
            <tr>
              <td width="20%" class="value etiqueta">Liquidación Banxico:</td>
              <td><span style="..." class="value"></span></td>
            </tr>
            </tbody>
          </table>
        </div>
        <div class="table_row" style="padding-bottom:5px;border-bottom:black thin solid">
          <table width="100%">

            <tbody>
            <tr>
              <td width="20%" class="value etiqueta">Iva:</td>
              <td><span style="padding-left:0" class="value">{{rows.iva}}</span></td>
            </tr>


            </tbody>
          </table>
        </div>
        <div class="table_row" style="padding-bottom:5px;border-bottom:black thin solid">

          <table width="100%">
            <colgroup>
              <col width="30%">
            </colgroup>
            <tbody>
            <tr>
              <td class="value etiqueta" style="text-align:center;" colspan="2">Ordenante</td>
            </tr>
            <tr>
              <td class="value etiqueta">Nombre:</td>
              <td><span class="value">MUITECH_SA</span></td>
            </tr>
            <tr>
              <td class="value etiqueta">Tipo Cuenta:</td>
              <td><span class="value">CLABE</span></td>
            </tr>
            <tr>
              <td class="value etiqueta">Cuenta:</td>
              <td><span class="value">646180266200000009</span></td>
            </tr>
            <tr>
              <td class="value etiqueta">RFC/CURP:</td>
              <td><span class="value">ND</span></td>
            </tr>
            <tr>
              <td class="value etiqueta" style="text-align:center;" colspan="2">Beneficiario</td>
            </tr>
            <tr>
              <td class="value etiqueta">Nombre:</td>
              <td><span class="value">{{rows.userName}}</span></td>
            </tr>
            <tr>
              <td class="value etiqueta">Tipo Cuenta:</td>
              <td><span class="value">{{bankType === 3 ? $t('借记卡') : 'clabe'}}</span></td>
            </tr>
            <tr>
              <td class="value etiqueta">Cuenta:</td>
              <td><span class="value">{{rows.bankNo}}</span></td>
            </tr>
            <tr>
              <td class="value etiqueta">RFC/CURP:</td>
              <td><span class="value">{{rows.idCard}}</span></td>
            </tr>
            <tr>
              <td class="value etiqueta" style="text-align:center;" colspan="2">&nbsp;</td>
            </tr>
            <tr>
              <td class="value etiqueta">Concepto de Pago:</td>
              <td><textarea
                  name="mainBorder:menu:panel:menuSpei:panel:menuEstadoOrdenes:panel:commonPanelBorder:detailsFragment:conceptoPago"
                  disabled="disabled" rows="3" cols="70" class="value"></textarea></td>
            </tr>
            <tr>
              <td class="value etiqueta">Referencia Numérica:</td>
              <td><span class="value">75</span></td>
            </tr>
            <tr>
              <td class="value etiqueta">Referencia Cobranza:</td>
              <td><span class="value"></span></td>
            </tr>
            <tr>
              <td class="value etiqueta" style="text-align:center;" colspan="2">&nbsp;</td>
            </tr>
            <tr>
              <td class="value etiqueta"><span>Catalogo Usuario1 : </span></td>
              <td><span style="padding-left:0" class="value"> </span></td>
            </tr>
            <tr>
              <td class="value etiqueta"><span>Catalogo Usuario2 : </span></td>
              <td><span style="padding-left:0" class="value"> </span></td>
            </tr>
            <tr>
              <td class="value etiqueta"><span>Email Beneficiario: </span></td>
              <td><span class="value"></span></td>
            </tr>
            </tbody>
          </table>

        </div>
        <div class="table_row" style="padding-bottom:5px;border-bottom:black thin solid">

        </div>
      </div>

    </div>

  </div>
</template>

<script>
export default {
  name: "index",
  props: {
    rows: {}
  },
}
</script>

<style scoped>
table {
  display: table;
  border-collapse: separate;
  box-sizing: border-box;
  text-indent: initial;
  white-space: normal;
  line-height: normal;
  font-weight: normal;
  font-size: medium;
  font-style: normal;
  text-align: start;
  border-spacing: 2px;
  border-color: grey;
  font-variant: normal;
}
.etiqueta{
  text-align: right;
  background-color: #d4e7ff;
  color: #000000;
}
tr {
  padding: 5px 0;
}

.etiqueta{text-align:right;background-color:#d4e7ff;}

.header_top {background-color:blue;color:white; }
.header_middle {background-color:#0079d6;color:white; }
.background_box { background-color:#99ccff; }
.border_box { border: thin solid #99ccff; }

/* Paneles con informacion de solo lectura del tipo "Etiqueta: Valor" */
div.table {border:#999999;border-style:outset;background-color:white;}
div.table_title_row {clear:both;background-color:blue;font-size:11px;font-weight:bold;color:white;width:100%;text-align:center;}
div.table_row {clear:both;padding-top: 5px;}
div.table_row span.label{float:left; font-weight:normal;text-align:right;padding-left:5px;}
div.table_row span.value{float:left; font-weight:bold;text-align:left;padding-left:5px;}
div.table_row span.value2{font-weight:bold;text-align:right;font-size:11px;}
div.table_row input.value{float:left; font-weight:bold;text-align:left;font-size:11px;margin-left:5px;}
div.table_row select.value{float:left; font-weight:bold;text-align:left;padding-left:5px;font-size:11px;}
div.table_row span.bluebackground{background:#9999ff;}
select.label option{font-weight:normal;font-size:11px;}
select.label {font-weight:normal;font-size:11px;}

td span.label{font-weight:normal;text-align:right;padding-left:5px;font-size:11px;}
td a.label {font-weight:normal;text-align:right;padding-left:5px;font-size:11px;}
td span.value{font-weight:bold;text-align:right;font-size:11px;}
td.label{font-weight:normal;text-align:right;padding-left:5px;font-size:11px;}
td.value{font-weight:bold;text-align:right;font-size:11px;}
.value{font-weight:bold;text-align:left;font-size:11px;}
td.bluebackground{background:#8fa7f9;font-weight:bold;}
tr.soft {background:#d4e7ff;}

span.wicket-ajax-indicator {z-index:20000;position:absolute;padding-left:5px;}
span.feedbackPanelERROR {font-weight: bold; color: red; font-size:11px}



</style>
